<!DOCTYPE html>
<html>

	<head>
		<meta charset="UTF-8">
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
		<title></title>
		<link rel="stylesheet" type="text/css" href="../commn/base.css" />
		<style type="text/css">
			.header {
				color: #0F88EB;
				font-size: 50px;
				font-weight: bold;
				height: 40px;
				line-height: 40px;
				text-align: center;
			}
			
			.bottom {
				height: 400px;
			}
			
			.xinxi {
				margin-top: 80px;
				-webkit-box-align: center;
			}
			
			.xinxi p:nth-child(2) {
				font-family: "微软雅黑";
				font-size: 14px;
				font-weight: bold;
			}
			
			.xinxi p:nth-child(3)>a {
				margin-left: 10px;
				-webkit-box-align: end;
				height: 40px;
				font-size: 14px;
				font-weight: bold;
				color: #0F88EB;
				line-height: 40px;
				text-decoration: none;
			}
			
			.bottom p {
				margin-top: 10px;
				height: 40px;
				line-height: 40px;
				text-align: center;
				/*border: 1px solid;*/
			}
			
			.user,
			.password,
			.nicheng,
			.email {
				width: 60%;
				height: 40px;
				text-indent: 1em;
				border: 1px solid #EEEEEE;
				-webkit-box-flex: 1;
				outline: none;
			}
			
			.bottom input[type=button] {
				height: 40px;
				width: 30%;
				color: white;
				font-size: 14px;
				border: 1px solid #0F88EB;
				background-color: #0F88EB;
				outline: none;
				border-radius: 40px;
			}
			
			.yanzheng {
				width: 29%;
				height: 40px;
				text-indent: 1em;
				font-size: 12px;
				border: 1px solid #EEEEEE;
				/*-webkit-box-flex: 1;*/
				outline: none;
			}
			
			.choose {
				border-bottom: 2px solid #0F88EB;
			}
		</style>
	</head>

	<body>
		<div class="all">

			<div class="bottom">
				<from>
					<div class="xinxi">
						<p class="header">
							知乎
						</p>
						<p>与世界分享你的知识、经验和见解</p>
						<p>
							<a href="../zhihu_index/index.html">登陆</a>
							<a href="reg.html" class="choose">注册</a>
						</p>
						<p><input type="text" placeholder="用户名" class="user" v-model="username"/></p>
						<p><input type="password" placeholder="密码(不少于6位)" class="password" v-model="password"/></p>
						<p><input type="text" placeholder="昵称" class="nicheng" v-model="nicheng"/></p>
						<p><input type="text" placeholder="邮箱" class="email" v-model="email"/></p>
						<p><input type="text" placeholder="请输入验证码" class="yanzheng" />&nbsp;<input type="button" id="aa" value="发送验证码" @click="jishi()"/></p>
						<p><input type="button" name="" @click="xm()" value="立即注册" /></p>
					</div>
				</from>
			</div>
		</div>
		<script src="../js/jquery-2.1.4.js" type="text/javascript" charset="utf-8"></script>
		<script src="../js/vue.js" type="text/javascript" charset="utf-8"></script>
		<script type="text/javascript">
			new Vue({
				el: "body",
				data: {
					username:"",
					password:"",
					nicheng:"",
					email:""
				},
				methods: {
					xm:function(){
						login(this.username,this.password,this.nicheng,this.email ) 
					},
					jishi:function() {
						settime();
					}
				}
			})
			
			function login(username,password,nicheng,email ) {
						_this  = this;
						var ss;
						var dd;
						$.ajax({
							type: 'get',
							//async:false,
							url: "http://v2.mashupcloud.cn/developer/auth.do",
							data: {
								appkey: 'FvWrIYOQoTUYVbscUNQoQAVqsLnZqKEN',
								appsecret: 'ugCfcSmyLkcbCGfIuFOPEgTgPQPbyJSE'

							},
							success: function(json) {
								//		            console.log(json);
								ss = JSON.parse(json)[1];
								dd = JSON.parse(json)[2];
								console.log('获得token成功');
								$.ajax({
									type: 'get',
									url: "http://v2.mashupcloud.cn/SQL/reg_user/",
									data: {
										appid: dd,
										token: ss,
										name: 'reg_user',
										_v1: username,
										_v2: password,
										_v3: nicheng,
										_v4: email
									},
									success: function(json) {
										console.log(JSON.parse(json));
										alert("注册成功");
										location.href = '../zhihu_index/index.html'
									},
									error: function(json) {
										console.log("err:" + json);
									}
								});
							},

							error: function(json) {

								console.log("err:" + json);

							}

						});
				}
						var a = 60;
						var $a = $("#aa");

						function settime() {
							if(a == 0) {
								$a.attr("disabled", false);
								$a.css("background-color", "#0F88EB");
								$a.css("border-color", "#0F88EB")
								$a.val("发送验证码");
								a = 60;
							} else {
								$a.attr("disabled", true);
								$a.val("重新发送(" + a + "s)");
								$a.css("font-size", "13px");
								$a.css("background-color", "lightskyblue");
								$a.css("border-color", "lightskyblue")
								a--;
								setTimeout(function() {
									settime();
								}, 1000)
							}
						};
					
		</script>
	</body>

</html>